{extend name="base" /}
{block name="css"}
{css href="__CSS__/zhifu.css" /}
<style>
.weui-flex {padding: 14px 0;}
.weui-flex-title {font-size: 1.2rem;text-align: center;}
.weui-flex-desc{text-align: center;font-size: 0.6rem;}
</style>
{/block}
{block name="body"}
<!-- 主要内容 开始 -->
<div class="weui-tab__bd-item">
    <header class="weui-navBar weui-navBar-fixed">
        <a href="javascript:history.go(-1);" class="weui-navBar-item">
            <i class="icon iconfont icon-fanhui"></i>
        </a>
        <div class="weui-center">
            <span class="weui-center-title">转账</span>
        </div>
        <a href="javascript:;" class="weui-navBar-item">
        </a>
    </header>
    <div class="weui-flex">
        <div class="weui-flex__item">
            <div class="weui-flex-price">
                <p class="weui-flex-title f-green">{$info.money|default=0.00}</p>
                <p class="weui-flex-desc">余额</p>
            </div>
        </div>
        <div class="weui-flex__item">
            <div class="weui-flex-price">
                <p class="weui-flex-title f-red">{$info.integral|default=0.00}</p>
                <p class="weui-flex-desc">积分</p>
            </div>
        </div>
    </div>
    <div class="weui-tab__panel">
        <div class="weui-cells weui-cells_form">
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">接收账户</label></div>
                <div class="weui-cell__bd">
                    <input class="weui-input" type="text" id="name" placeholder="请输入接收账户">
                </div>
            </div>
            <div class="weui-cell">
                <div class="weui-cell__hd"><label class="weui-label">转账金额</label></div>
                <div class="weui-cell__bd">
                  <input class="weui-input" type="number" pattern="[0-9]*" id="code" placeholder="请输入转账金额">
                </div>
            </div>
        </div>
        <div class="weui-btn-area" style="display: none;">
          <button class="weui-btn weui-btn_primary ljzf_but">去支付</button>
        </div>
    </div>
</div>
<!--浮动层-->
<div class="ftc_wzsf">
    <div class="srzfmm_box">
        <div class="qsrzfmm_bt clear_wl">
            <img src="/static/images/xx_03.jpg" class="tx close fl">
            <span class="fl">请输入支付密码</span></div>
        <div class="zfmmxx_shop">
            <div class="demos-title f-dary">转账给：***</div>
            <div class="zhifu_price f-red">￥9999</div></div>
        <ul class="mm_box">
            <li></li><li></li><li></li><li></li><li></li><li></li>
        </ul>
    </div>
    <div class="numb_box">
        <div class="xiaq_tb">
            <img src="/static/images/jftc_14.jpg" height="10"></div>
        <ul class="nub_ggg">
            <li><a href="javascript:void(0);" class="zf_num">1</a></li>
            <li><a href="javascript:void(0);" class="zj_x zf_num">2</a></li>
            <li><a href="javascript:void(0);" class="zf_num">3</a></li>
            <li><a href="javascript:void(0);" class="zf_num">4</a></li>
            <li><a href="javascript:void(0);" class="zj_x zf_num">5</a></li>
            <li><a href="javascript:void(0);" class="zf_num">6</a></li>
            <li><a href="javascript:void(0);" class="zf_num">7</a></li>
            <li><a href="javascript:void(0);" class="zj_x zf_num">8</a></li>
            <li><a href="javascript:void(0);" class="zf_num">9</a></li>
            <li><a href="javascript:void(0);" class="zf_empty">清空</a></li>
            <li><a href="javascript:void(0);" class="zj_x zf_num">0</a></li>
            <li><a href="javascript:void(0);" class="zf_del">删除</a></li>
        </ul>
    </div>
    <div class="hbbj"></div>
</div>
<!-- 主要内容 结束 -->
{/block}
{block name="js"}
<script type="text/javascript">
    $(function(){
        $("#code").keyup(function(){
            var num_left = parseFloat($(".f-green").text());
            var num = parseFloat($(this).val());
            if (num > num_left){
                $('.weui-btn-area').hide();
                $.toast('可用余额不足！','text');
            }else{
                $('.weui-btn-area').show();
            }
        });
        var $code = $('#code');
        var $name = $('#name');
        $name.on('input', function(){
            if ($name.val() && $code.val()>0){
                $('.weui-btn-area').show();
            }else{
                $('.weui-btn-area').hide();
            }
        });
        //出现浮动层
        $(".ljzf_but").click(function(){
            $(".f-dary").html('转账给'+$('#name').val());
            $(".f-red").html('￥'+$('#code').val());
            $(".ftc_wzsf").show();
        });
        //关闭浮动
        $(".close").click(function(){
            $(".ftc_wzsf").hide();
            $(".mm_box li").removeClass("mmdd");
            $(".mm_box li").attr("data","");
            i = 0;
        });
        //数字显示隐藏
        $(".xiaq_tb").click(function(){
            $(".numb_box").slideUp(500);
        });
        $(".mm_box").click(function(){
            $(".numb_box").slideDown(500);
        });
        var i = 0;
        $(".nub_ggg li .zf_num").click(function(){
            if(i<6){
                $(".mm_box li").eq(i).addClass("mmdd");
                $(".mm_box li").eq(i).attr("data",$(this).text());
                i++
                if (i==6) {
                  setTimeout(function(){
                    var data = "";
                        $(".mm_box li").each(function(){
                        data += $(this).attr("data");
                    });
                    var name = $.trim($('#name').val());
                    var code = $.trim($('#code').val());
                    if(!code || !/^(([1-9]\d*)|\d)(\.\d{1,2})?$/.test(code)) $.toptip('请输入转账金额!');
                    else if(!code) $.toptip('收款人不能为空哟!');
                    else if(!data) $.toptip('密码不能为空哟!');
                    else if(data.length<6) $.toptip('请输入六位以上密码哟!');
                    else $.post('turn.html',{pwd:data,code:code,name:name},function(res) {
                        if (res.code === 1) {
                            $.toast(res.msg,'text');
                            setTimeout(function(){
                                location.href = res.url;
                            },1500);
                        } else {
                            $.toast(res.msg,'text');
                        }
                    });
                  },100);
                };
            }
        });
        $(".nub_ggg li .zf_del").click(function(){
            if(i>0){
                i--
                $(".mm_box li").eq(i).removeClass("mmdd");
                $(".mm_box li").eq(i).attr("data","");
            }
        });

        $(".nub_ggg li .zf_empty").click(function(){
            $(".mm_box li").removeClass("mmdd");
            $(".mm_box li").attr("data","");
            i = 0;
        });

        //循环请求局部刷新
        var intervalv = setInterval(function(){
            $.post('get_money.html', function(result){
              $('.price p').text('¥'+result.data.money);
            })
        }, 5000);
    });
    //循环请求局部刷新
    var intervalv = setInterval(function(){
        $.post('get_money.html', function(result){
          $('.f-green').text(result.data.money);
        });
    }, 5000);
</script>
{/block}